<template>
  <div style="background-color: #e5273b; padding-bottom: 0.8rem">
    <div class="insufficient">
      <div class="Mobile_points">
        <div class="text">我的移动积分:{{ jifen }}</div>
      </div>
      <div class="Voucher_package">
        <div class="title">
          <span>系 </span><span>统 </span><span>提 </span><span>醒 </span>
        </div>
        <div class="content">
          <div>您的移动积分不足,暂时无法兑换</div>
          <div>期待您下次参与~</div>
        </div>
      </div>
      <div class="exchange_btn">
        <img src="../assets/back_btn.bddedbab.png" alt="" />
      </div>
      <div class="service">专属客户经理: 4008256216</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "exchange",
  components: {},
  data() {
    return {
      jifen: "",
    };
  },
  mounted() {
    this.jifen = this.$route.query.jifen;
  },
  methods: {},

};
</script>

<style lang="scss" scoped>
.insufficient {
  background: url("../assets/bg2.ae68573e.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100vh;
  padding: 1rem;
  .Mobile_points {
    width: 100%;
    height: 3rem;
    background: url("../assets/banner.6ceb17c2.png");
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    .text {
      position: absolute;
      bottom: 0.7rem;
      left: 0;
      right: 0;
      font-size: 0.4rem;
      color: #873100;
    }
  }
  .Voucher_package {
    margin-top: 1rem;
    width: 100%;
    height: 7rem;
    background: url("../assets/empty_bg.b7236dbb.png");
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    .title {
      position: absolute;
      top: 1.4rem;
      font-size: 0.6rem;
      left: 0;
      right: 0;
      color: white;
    }
    .content {
      position: absolute;
      top: 3rem;
      font-size: 0.4rem;
      left: 0;
      right: 0;
      color: #d86175;
    }
  }
  .exchange_btn {
    width: 80%;
    height: 1rem;
    margin: auto;
    margin-top: 0.5rem;

    img {
      width: 100%;
      // height: 100%;
    }
  }
  .service {
    margin-top: 1rem;
    font-size: 0.5rem;
    border-bottom: 1px solid #685c5e;
    color: #685c5e;
  }
}
</style>